<!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8">
<meta name="description"
    content="The box decoration should be sliced, except for the outline. The
    box should extend to the bottom on the first page, but it currently does not">
<style>
@page {
    size: 400pt 300pt;
    margin: 50pt;
}

html {
    font-family: sans-serif;
    font-size: 14pt;
    line-height: 18pt;
}

body {
    outline: thin solid rgb(0, 0, 0, 0.25);
}

div {
    margin: 20pt;
    padding: 10pt;
    outline: 2pt solid red;
    border: 4pt solid rgb(255, 0, 0, 0.25);
    border-radius: 14pt;
    background-color: rgb(255, 0, 0, 0.1);
}
</style>
</head>

<body>
    <div>Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor
    incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
    nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat.
    Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat
    nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa
    qui officia deserunt mollit anim id est laborum.</div>
</body>

</html>
